import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_boost/flutter_boost.dart';
import 'package:hzcloud_flt/feature/router.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

class IndexListView extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _IndexListViewState();
  }
}

class _IndexListViewState extends State<IndexListView>
    with AutomaticKeepAliveClientMixin {
  RefreshController _refreshController =
      RefreshController(initialRefresh: false);

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    // TODO: implement build
    return SmartRefresher(
      controller: _refreshController,
      enablePullDown: false,
      enablePullUp: true,
      child: ListView.separated(
          itemBuilder: (BuildContext context, int index) {
            if (index == 0) {
              return TTitleBPhotosItem(
                onTap: () {
                  BoostNavigator.instance
                      .push(HZRouter.instance.commonModule.videoPage.path);
                },
              );
            } else if (index == 1) {
              return TTitleBLargePhoto();
            } else if (index == 2) {
              return LPhotoRTitleItem();
            } else if (index == 3) {
              return NewsTextItem();
            }
            return TTitleBPhotosItem();
          },
          physics: ClampingScrollPhysics(),
          separatorBuilder: (BuildContext context, int index) {
            return SizedBox(height: 15);
          },
          itemCount: 20),
    );
  }

  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;
}

//top: 标题 bottom：3张图片
class TTitleBPhotosItem extends StatelessWidget {
  final data;
  final Function onTap;

  const TTitleBPhotosItem({Key key, this.data, this.onTap}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
      double width = ((constraints.maxWidth - 30 - 20) / 3.0).floorToDouble();
      return GestureDetector(
        onTap: onTap,
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 15),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                '入额无orIE瑞瑞饿哦了我我欧瑞偶尔五日入额无orIE瑞瑞饿哦了我',
                style: TextStyle(fontWeight: FontWeight.w600, fontSize: 17),
                maxLines: 3,
                overflow: TextOverflow.ellipsis,
              ),
              Container(
                margin: EdgeInsets.only(top: 10),
                height: 80,
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    CachedNetworkImage(
                      width: width,
                      imageUrl: 'https://alifei01.cfp.cn/creative/vcg/veer/800/new/VCG41N627832540.jpg',
                      placeholder: (context, url) => Image.asset(
                        'assets/images/placeholder_2.png',
                        fit: BoxFit.fill,
                      ),
                      fit: BoxFit.fill,
                    ),
                    CachedNetworkImage(
                      width: width,
                      imageUrl: 'https://t7.baidu.com/it/u=475854499,3315837189&fm=193&f=GIF',
                      placeholder: (context, url) => Image.asset(
                        'assets/images/placeholder_2.png',
                        fit: BoxFit.fill,
                      ),
                      fit: BoxFit.fill,
                    ),
                    CachedNetworkImage(
                      width: width,
                      imageUrl: 'https://t7.baidu.com/it/u=4156605965,1856730414&fm=193&f=GIF',
                      placeholder: (context, url) => Image.asset(
                        'assets/images/placeholder_2.png',
                        fit: BoxFit.fill,
                      ),
                      fit: BoxFit.fill,
                    )
                  ],
                ),
              ),
              Row(
                children: [
                  OutlinedButton(
                    onPressed: () {},
                    child: Text(
                      '新闻资讯',
                      style: TextStyle(fontSize: 12),
                    ),
                    style: OutlinedButton.styleFrom(
                        minimumSize: Size(0, 0),
                        padding: EdgeInsets.symmetric(horizontal: 5),
                        side: BorderSide(color: Colors.blue),
                        enableFeedback: false),
                  ),
                  Flexible(
                    child: Padding(
                      padding: EdgeInsets.only(left: 10),
                      child: Text(
                        '2019-09',
                        style:
                            TextStyle(fontSize: 12, color: Color(0xFF999999)),
                      ),
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      );
    });
  }
}

//top: 标题 bottom：1张大图片
class TTitleBLargePhoto extends StatelessWidget {
  final data;

  const TTitleBLargePhoto({Key key, this.data}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
      double width = constraints.maxWidth - 30;
      return Container(
        padding: EdgeInsets.symmetric(horizontal: 15),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              '入额无orIE瑞瑞饿哦了我我欧瑞偶尔五日入额无orIE瑞瑞饿哦了我',
              style: TextStyle(fontWeight: FontWeight.w600, fontSize: 17),
              maxLines: 3,
              overflow: TextOverflow.ellipsis,
            ),
            Padding(
              padding: EdgeInsets.only(top: 10),
              child: CachedNetworkImage(
                width: width,
                height: 200,
                imageUrl: 'https://t7.baidu.com/it/u=2222291659,3314023150&fm=193&f=GIF',
                placeholder: (context, url) => Image.asset(
                  'assets/images/placeholder_1.png',
                  fit: BoxFit.none,
                ),
                fit: BoxFit.fill,
              ),
            ),
            Row(
              children: [
                OutlinedButton(
                  onPressed: () {},
                  child: Text(
                    '新闻资讯',
                    style: TextStyle(fontSize: 12),
                  ),
                  style: OutlinedButton.styleFrom(
                      minimumSize: Size(0, 0),
                      padding: EdgeInsets.symmetric(horizontal: 5),
                      side: BorderSide(color: Colors.blue),
                      enableFeedback: false),
                ),
                Flexible(
                  child: Padding(
                    padding: EdgeInsets.only(left: 10),
                    child: Text(
                      '2019-09',
                      style: TextStyle(fontSize: 12, color: Color(0xFF999999)),
                    ),
                  ),
                ),
              ],
            )
          ],
        ),
      );
    });
  }
}

//左侧: 图片 右侧：标题
class LPhotoRTitleItem extends StatelessWidget {
  final data;

  const LPhotoRTitleItem({Key key, this.data}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
      return Container(
        padding: EdgeInsets.symmetric(horizontal: 15),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                CachedNetworkImage(
                  width: 120,
                  height: 80,
                  imageUrl: 'https://t7.baidu.com/it/u=1172634188,2346880034&fm=193&f=GIF',
                  placeholder: (context, url) => Image.asset(
                    'assets/images/placeholder_2.png',
                    fit: BoxFit.fill,
                  ),
                  fit: BoxFit.cover,
                ),
                Expanded(
                  child: Padding(
                    padding: EdgeInsets.only(left: 10),
                    child: Text(
                      '入额无orIE瑞瑞饿哦了我我欧瑞偶尔五日入额无orIE瑞瑞饿哦了我',
                      style:
                          TextStyle(fontWeight: FontWeight.w600, fontSize: 17),
                      maxLines: 3,
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                )
              ],
            ),
            Row(
              children: [
                OutlinedButton(
                  onPressed: () {},
                  child: Text(
                    '新闻资讯',
                    style: TextStyle(fontSize: 12),
                  ),
                  style: OutlinedButton.styleFrom(
                      minimumSize: Size(0, 0),
                      padding: EdgeInsets.symmetric(horizontal: 5),
                      side: BorderSide(color: Colors.blue),
                      enableFeedback: false),
                ),
                Flexible(
                  child: Padding(
                    padding: EdgeInsets.only(left: 10),
                    child: Text(
                      '2019-09',
                      style: TextStyle(fontSize: 12, color: Color(0xFF999999)),
                    ),
                  ),
                ),
              ],
            )
          ],
        ),
      );
    });
  }
}

//左侧: 图片 右侧：标题
class NewsTextItem extends StatelessWidget {
  final data;

  const NewsTextItem({Key key, this.data}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
      return Container(
        padding: EdgeInsets.symmetric(horizontal: 15),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              '入额无orIE瑞瑞饿哦了我我欧瑞偶尔五日入额无orIE瑞瑞饿哦了我',
              style: TextStyle(fontWeight: FontWeight.w600, fontSize: 17),
              maxLines: 3,
              overflow: TextOverflow.ellipsis,
            ),
            Row(
              children: [
                OutlinedButton(
                  onPressed: () {},
                  child: Text(
                    '新闻资讯',
                    style: TextStyle(fontSize: 12),
                  ),
                  style: OutlinedButton.styleFrom(
                      minimumSize: Size(0, 0),
                      padding: EdgeInsets.symmetric(horizontal: 5),
                      side: BorderSide(color: Colors.blue),
                      enableFeedback: false),
                ),
                Flexible(
                  child: Padding(
                    padding: EdgeInsets.only(left: 10),
                    child: Text(
                      '2019-09',
                      style: TextStyle(fontSize: 12, color: Color(0xFF999999)),
                    ),
                  ),
                ),
              ],
            )
          ],
        ),
      );
    });
  }
}
